<template>
  <div class="app-container">
    <div class="filter-container">
      <el-form :inline="true" :model="formModel">
        <el-form-item class="no-warn-item" label="工厂:" prop="plantNo">
          <el-select
            v-model="formModel.plantNo"
            clearable
            filterable
            @change="changePlantNo"
            @clear="clearPlantNo"
          >
            <el-option
              v-for="item in plantOptions"
              :key="item.plantNo"
              :label="item.plantNo+'-'+item.plantNameC"
              :value="item.plantNo"
            />
          </el-select>
        </el-form-item>
        <el-form-item class="no-warn-item" label="产线:" prop="lineNo">
          <el-select v-model="formModel.lineNo" clearable filterable>
            <el-option
              v-for="item in lineOptions"
              :key="item.lineNo"
              :label="item.lineNo+'-'+item.lineNameC"
              :value="item.lineNo"
            />
          </el-select>
        </el-form-item>
        <el-row class="submit-area">
          <el-col :span="24">
            <el-button
              v-if="hasPermission('onlineProductivityInfo_select')"
              type="primary"
              plain
              @click="queryList(false)"
            >查询
            </el-button>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <hey-table ref="table" :table-data="tableData" :columns="columns" :auto-width="false" />
  </div>
</template>

<script>

export default {
  name: 'OnlineProductivityInfoList',
  props: {},
  data() {
    return {
      // 工厂列表
      plantOptions: [],
      // 产线列表
      lineOptions: [],
      // 弹框
      dialogVisible: false,
      tableData: [],
      // 查询条件
      formModel: {
        plantNo: '',
        lineNo: ''
      },
      columns: [
        { title: '工厂代码', key: 'plantNo' },
        { title: '工厂名称', key: 'plantNameC' },
        { title: '产线代码', key: 'lineNo' },
        { title: '产线名称', key: 'lineNameC' },
        { title: '产能', key: 'lineProductivity' },
        { title: '允许上线数', key: 'allowOnlineNum' }
      ]
    }
  },
  computed: {},
  mounted() {
    const param = {}
    param.isDelete = '0'
    param.status = '1'
    this.getPlantOptions(param)
  },
  methods: {
    // 选择工厂后查询下属产线列表
    changePlantNo(value) {
      if (value !== '') {
        this.formModel.lineNo = ''
        const param = { plantNo: value }
        param.isDelete = '0'
        param.status = '1'
        this.getLineOptions(param)
      }
    },
    // 清除工厂查询条件清除产线列表
    clearPlantNo() {
      this.formModel.lineNo = ''
      this.lineOptions = ''
    },
    // 获取工厂列表
    getPlantOptions(param) {
      this.get('/tmBasPlant/queryTmBasPlantList', param).then(res => {
        this.plantOptions = res
      })
    },
    // 获取产线列
    getLineOptions(param) {
      this.get('/tmBasLine/listLine', param).then(res => {
        this.lineOptions = res
      })
    },
    queryList() {
      this.$refs.table.query('/carArea/pageOnlineProductivityInfo', this.formModel, '', false)
    }
  }
}
</script>
